﻿@{
    ViewBag.Title = "LoginOn";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <title>用户登录</title>
    <link href="~/Content/easyui/themes/metro/easyui.css" rel="stylesheet" />
    <link href="~/Content/easyui/themes/icon.css" rel="stylesheet" />
    <script src="~/Content/easyui/jquery.min.js"></script>
    <script src="~/Content/easyui/jquery.easyui.min.js"></script>
    <script src="~/Content/easyui/locale/easyui-lang-zh_CN.js"></script>
    <script src="~/Content/common/js/com.js"></script>
    <style>

        html, body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        h1 {
            color: rgb(128, 128, 128);
            text-align: center;
        }

        a:link, a:hover, a:visited, a:active {
            color: rgb(128, 128, 128);
            text-decoration: none;
        }

        form {
            width: 400px;
            min-width: 400px;
            position: absolute;
            left: 40%;
            top: 15%;
            margin: 0;
            padding: 30px;
            background-color: white;
            border: 2px solid rgba(128, 128, 128, 0.2);
            border-radius: 10px;
        }

            form div {
                margin-bottom: 10px;
            }
    </style>
</head>
<body>
    <form>
        <div>
            <h1>用户登录</h1>
        </div>
        <div>
            @*        data-options="iconCls:'icon-man',iconWidth:30,iconAlign:'left',prompt:'用户名'" *@
            <input id="accountName" type="text" class="easyui-textbox" style="width:100%;height:35px;" value="admin" />
        </div>
        <div>
            @*  class="easyui-passwordbox" data-options="iconWidth:30,iconAlign:'left',prompt:'密码'" *@
            <input id="passWord" style="width:100%;height:35px;" value="123456" />
        </div>
        <div>
            <input class="easyui-checkbox" label="记住密码" labelPosition="after" labelWidth="70" />
        </div>
        <div>
            <input class="easyui-linkbutton" id="login" value="登陆" style="width:100%;height:35px;" />
        </div>
        <div>
            <div style="display:inline;">
                <a href="javascript:void(0)">还未注册？</a>
            </div>
            <div style="display:inline;margin-left:170px;">
                <a href="javascript:void(0)">忘记密码？</a>
            </div>
        </div>
    </form>

    <script type="text/javascript">

        $(function () {
            $('#accountName').textbox({
                iconCls: 'icon-man',
                iconAlign: 'left',
                iconWidth: 30,
                prompt: '用户名'
            })

            $('#passWord').passwordbox({
                iconAlign: 'left',
                iconWidth: 30,
                prompt: '密码'
            })
        })


        $('#login').bind('click', function () {

            var obj = {
                UserName: $('#accountName').textbox('getText'),//"admin",
                UserPwd: $('#passWord').passwordbox('getValue')// "123456"
            };
            $.ajax({
                url: "/Login/WebUserLogin",
                type: 'post',
                data: JSON.stringify(obj),
                dataType: "json",
                contentType: 'application/json',
                success: function (data) {
                    if (data.ResultType == 1) {
                        localStorage.setItem("token", data.Entity.Token)
                        window.location.href = '/';
                    } else {
                        easyAlert(data.Message);
                    }
                },
                error: function (e) {
                    easyAlert(e.Message);
                    //easyAlert(e.responseText);
                },
                beforeSend: function () {
                    //alert("正在登陆处理，请稍候...");
                },
                complete: function () {
                    // easyAlert("登录成功");
                }
            });
        });
    </script>
</body>
</html>

